<template>
  <el-dialog title="查看" :visible.sync="dialogFormVisible" :append-to-body="true" width="65%" @close="handleClose" @open="handleOpen" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-row :gutter="20">
        <el-col :span="10">问诊单名称：{{mainFrom.inquiryName}}</el-col>
        <el-col :span="10">备注： {{mainFrom.remarks}}</el-col>
      </el-row>
      <div class="consultation-list">
        <div class="consultation-item" v-for="(item, currentIndx) in mainFrom.classificationVOList" :key="item.classificationCode">
          <div class="consultation-title">
              <div class="left-title">
                <span>{{currentIndx + 1}}</span>
                <span>.</span>
                <span>{{item.classificationName}}</span>
              </div>
          </div>
          <div class="consultation-table" v-for="(childrenItem, index) in item.symptomListDTOS" :key="index">
            <el-row :gutter="20">
              <el-col :span="8">症状名称：{{ childrenItem.symptomName }}</el-col>
              <el-col :span="8">症状简称:{{ childrenItem.symptomAbbreviation }}</el-col>
              <el-col :span="8">类型：{{ getClassificationName(childrenItem.dataType) }}</el-col>
            </el-row>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
      </div>
  </el-dialog>
</template>
<script>
import {getDetail } from "@/api/system/consultationFormManage";
export default {
  data() {
    return {
      dialogFormVisible: false,
      mainFrom: {},
      classificationOptionsList: []
    }
  },
  props: {
    currentId: String
  },
  methods: {
    // 打开弹窗回调事件
    handleOpen () {
      getDetail(this.currentId).then(res => {
        this.mainFrom = res.data.data
      })
    },
    // 获取分类名称
    getClassificationName (code) {
      if (code === 'STRING') {
        return '字符型'
      } else if (code === 'FLOAT') {
        return '浮点型'
      } else if (code === 'BOOLEAN') {
        return '布尔'
      } else {
        return ''
      }
    },
    // 关闭弹窗
    handleClose() {
      this.mainFrom = {}
      this.dialogFormVisible = false
    }
  }
};
</script>
  
<style scoped>
.consultation-list {
  width: 100%;
  height: 300px;
  overflow-y: auto;
  overflow-x: hidden;
}
.consultation-item {
  width: 100%;
}
.consultation-item {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #E1E9F0;
  border-radius: 5px;
  margin-bottom: 20px;

}
.consultation-title {
  width: 100%;
  height: 32px;
  line-height: 32px;
  display: flex;
}
.left-title {
  flex: 1;
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
}
.right-title {
  width: 80px;
  display: inline-block;
  cursor: pointer;
  color: #409EFF;
}
.consultation-table {
  margin-top: 10px;
}
</style>
  